:root {
    --site-bg: #F2D295;
    --sidebar-bg: #9B6247;
    --sidebar-text: #424240;
    --sidebar-button-bg: #9B6247;
    --sidebar-button-bg-hover: #FFE1C6;
    --sidebar-button-text: #4E223D;
    --sidebar-button-text-hover: #dc96aa;
    --sidebar-border-color: #9B6247;
}
body {
    font-size: 16px;
    background: var(--site-bg);
}
* {
    box-sizing: border-box;
}
#container {
  max-width: 1200px;
  margin: 0 auto;
}
#heading {
    width: 100%;
    height: fit-content;
    position: relative;
    top: 7px;
}
#sidebar {
    width: 223px;
    padding: 2em 1em;
    margin: 20px;
    order: 2;
    overflow-y: auto;
}
#navbar li {
    text-align: center;
    margin-top: 0;
    padding: 0;
    list-style-type: none;
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

#sidebar nav li a {
    min-width: 160px;
    min-height: 46px;
    vertical-align: middle;
    display: inline-block;
    background: var(--sidebar-button-bg);
    color: var(--sidebar-button-text);
    font-weight: bold;
    border-radius: 1rem;
    outline: 1px solid #fff0;
    transition: .2s;
    text-decoration: none;
}
#sidebar nav li a:visited {color: var(--sidebar-text);}
#sidebar nav li a:hover {
  background: var(--sidebar-button-bg-hover);
  color: var(--sidebar-button-text-hover);
  outline: 2px solid var(--sidebar-text);
  outline-offset: 3px;
}
/*and add some spacing around them too*/
#sidebar nav {
  margin-block:2em;
}
#sabres {
    margin: 20px;
}
#navbar li {
    display: flex;
    list-style-type: none;
    justify-content: space-evenly;
    padding-top: 5px;
}

#flex {
    display: flex;
}
footer {
    width: 100%;
    height: 40px;
    padding: 10px;
    text-align: center;
}

 /* BELOW THIS POINT IS MEDIA QUERY */

@media screen and (max-width: 900px) {
    #container {
        display: flex;
        flex-wrap: wrap;
        flex-direction: column;
    }
    #heading img {
        width: 90%;
    }
    #sidebar {
        width: 100%;
        order: 1;
    }
    #sabres img {
        order: 2;
        position: absolute;
        bottom: -34px;
    }
}